<template>
	<view :data-theme="themeStyle" class="outbound ns-margin-top">
		<view class="flex-list">
			<view class="tip">基本信息:</view>
			<view class="flex-item ns-border-color-gray">
				<view class="flex-left"><view class="flex-text">账号</view></view>
				<view class="flex-right" v-if="!is_edit">
					<input
						placeholder="请输入账号"
						v-model="formData.username"
						placeholder-class="ns-text-color-gray-darken ns-font-size-base"
						class="ns-text-color-gray-darken ns-font-size-base"
					/>
				</view>
				<view class="flex-right" v-else>
					<text>{{formData.username}}</text>
				</view>
			</view>
			<view class="flex-item ns-border-color-gray" v-if="!is_edit">
				<view class="flex-left"><view class="flex-text">密码</view></view>
				<view class="flex-right">
					<input
						placeholder="请输入密码"
						v-model="formData.password"
						placeholder-class="ns-text-color-gray-darken ns-font-size-base"
						class="ns-text-color-gray-darken ns-font-size-base"
						type="password"
						maxlength="18"
					/>
				</view>
			</view>
			<view class="flex-item ns-border-color-gray">
				<view class="flex-left"><view class="flex-text">昵称</view></view>
				<view class="flex-right">
					<input
						placeholder="请输入昵称"
						v-model="formData.nickname"
						placeholder-class="ns-text-color-gray-darken ns-font-size-base"
						class="ns-text-color-gray-darken ns-font-size-base"
						type="text"
					/>
				</view>
			</view>
			<view class="tip">提现资料:</view>
			<view class="flex-item ns-border-color-gray">
				<view class="flex-left"><view class="flex-text">真实姓名</view></view>
				<view class="flex-right">
					<input
						placeholder="请输入真实姓名"
						v-model="formData.realname"
						placeholder-class="ns-text-color-gray-darken ns-font-size-base"
						class="ns-text-color-gray-darken ns-font-size-base"
						type="text"
					/>
				</view>
			</view>
			<view class="flex-item ns-border-color-gray">
				<view class="flex-left"><view class="flex-text">手机号</view></view>
				<view class="flex-right">
					<input
						placeholder="请输入手机号"
						v-model="formData.mobile"
						placeholder-class="ns-text-color-gray-darken ns-font-size-base"
						class="ns-text-color-gray-darken ns-font-size-base"
						type="number"
						maxlength="11"
					/>
				</view>
			</view>
			<view class="flex-item ns-border-color-gray">
				<view class="flex-left"><view class="flex-text">银行名称</view></view>
				<view class="flex-right">
					<input
						placeholder="请输入银行名称"
						v-model="formData.branch_bank_name"
						placeholder-class="ns-text-color-gray-darken ns-font-size-base"
						class="ns-text-color-gray-darken ns-font-size-base"
						type="text"
					/>
				</view>
			</view>
			<view class="flex-item ns-border-color-gray">
				<view class="flex-left"><view class="flex-text">银行账号</view></view>
				<view class="flex-right">
					<input
						placeholder="请输入银行卡号"
						v-model="formData.bank_account"
						placeholder-class="ns-text-color-gray-darken ns-font-size-base"
						class="ns-text-color-gray-darken ns-font-size-base"
						type="number"
						maxlength="19"
					/>
				</view>
			</view>
		</view>
		
	<!-- 	<view class="desc" v-if="curr_role == 'agent_one'">
			<text>二级代理商必须为团队成员</text>
		</view>
 -->
		<view v-if="is_edit == false" class="confirm-btn" @click="save" ><view>添加</view></view>
		<view v-else="is_edit == true" class="confirm-btn" @click="save1" ><view>修改</view></view>
	</view>
</template>

<script>
import validate from 'common/js/validate.js';
export default {
	data() {
		return {
			falg:false,
			formData: {
				member_id: this.username,
				username: '',
				password: '',
				nickname: '',
				realname: '',
				mobile: '',
				branch_bank_name: '',
				bank_account: '',
			},
			is_edit: false,
			data_list: [],
			username: '',
			//角色信息 区分代理商的等级
			// curr_role:'',
		};
	},
	computed: {
		//vueX页面主题
		themeStyle() {
			return 'theme-' + this.$store.state.themeStyle;
		}
	},
	onLoad(option) {
		if(option.member_id) {
			this.username = option.member_id;
			this.is_edit = true;
		}
	},
	onShow() {
		if(this.username){
			this.getMessage();
		}
	},
	methods: {
		getMessage() {
			this.$api.sendRequest({
				//换详情接口
				url: '/api/member/businessUserInfo',
				data: {
					member_id: this.username
				},
				success: res => {
					console.log(res);
					if(res.code>=0){
						this.formData = res.data;
					}else {
						this.$util.showToast({
							title: res.message
						})
					}
				},
				fail: res => {
					
				}
			});
			
		},
		verify() {
			var rule = [   
				{
					name: 'username',
					checkType: 'required',
					errorMsg: '请输入姓名'
				},
				{
					name: 'password',
					checkType: 'required',
					errorMsg: '请输入密码'
				},
				
				{
					name: 'nickname',
					checkType: 'required',
					errorMsg: '请输入昵称'
				},
				{
					name: 'realname',
					checkType: 'required',
					errorMsg: '请输入真实姓名'
				},
				{
					name: 'mobile',
					checkType: 'phoneno',
					errorMsg: '请输入正确的手机号',
				},
				{
					name: 'branch_bank_name',
					checkType: 'required',
					errorMsg: '请输入银行名称'
				},
				{
					name: 'bank_account',
					checkType: 'required',
					errorMsg: '请输入银行账号'
				},
			];
			var checkRes = validate.check(this.formData, rule);
			if(!checkRes){
				this.$util.showToast({
					title: validate.error
				});
				this.flag = false;
				return false;
			}
			return true;
		},
		save() {
			if (this.verify()) {
				if(this.falg) return false
				this.falg = true
				this.$api.sendRequest({
					url: '/api/member/addBusinessUser',
					data: this.formData,
					success: res => {
						this.falg = false
						if (res.code >= 0) {
							this.$util.showToast({
								title: res.message
							});
							setTimeout(res=>{
								this.$util.goBack()
							},1000)
						}else{
							this.$util.showToast({title:res.message})
						}
						this.falg = false;
					}
				});
			}
		},
		save1() {
			if (this.verify()) {
				if(this.falg) return false
				this.falg = true
				this.$api.sendRequest({
					url: '/api/member/editBusinessUser',
					data: this.formData,
					success: res => {
						this.falg = false
						if (res.code >= 0) {
							this.$util.showToast({
								title: res.message
							});
							setTimeout(res=>{
								this.$util.goBack()
							},1000)
						}else{
							this.$util.showToast({title:res.message})
						}
						this.falg = false;
					}
				});
			}
		}
	}
};
</script>
<style scoped></style>
<style lang="scss" scoped>
page {
	padding-bottom: 150rpx;
}
@import '@/otherpages/member/bussiness_user/public/css/classification.scss';

.list_padding_none {
	padding-bottom: 0;
}
.list {
	.time {
		margin-bottom: 0;
	}
}
.flex-list {
	margin-top: 0;
}
.flex-text {
	input {
		display: inline-block;
		vertical-align: middle;
		font-size: 28rpx;
	}
}
.flex {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
// 结算悬浮按钮
.confirm-btn {
	width: 100%;
	height: 144rpx;
	background-color: #fff;
	view {
		width: 90%;
		height: 80rpx;
		border-radius: $ns-border-radius;
		background-color: #ff464a;
		line-height: 80rpx;
		color: #fff;
		text-align: center;
		margin-top: 20rpx;
	}
	display: flex;
	z-index: 8;
	justify-content: center;
	position: fixed;
	bottom: 0;
}
.desc {
	margin: 20rpx 40rpx;
	font-size: 24rpx;
	color: #999;
}
</style>
